<template>
  <div class="regularization-container">
    <el-dialog title="转正时间" :visible.sync="visible">
      <div class="info">
        <el-avatar
          style="width: 100px ;height: 100px;line-height: 60px;"
          :size="60"
          src="https://empty"
          @error="errorHandler"
        >
          <img
            src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"
          >
        </el-avatar>
        <div class="title">
          <h4>管理员</h4>
          <br>
          手机 <span>13800000002</span> 部门 <span>总裁办</span><br>
          <br>
          入职时间 <span>2018-11-02</span>
        </div>
      </div>
      <hr>
      <el-form :model="form">
        <el-form-item
          label="转正时间"
          prop="reTime"
          :label-width="formLabelWidth"
        >
          <el-date-picker
            v-model="form.regTime"
            type="date"
            placeholder="选择日期"
            style="width:30%"
          />
        </el-form-item>
        <el-form-item
          prop="evaluate"
          label="转正评价"
          :label-width="formLabelWidth"
        >
          <el-input v-model="form.evaluate" type="textarea" style="width:30%" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button
          type="primary"
          @click="dialogFormVisible = false"
        >提交</el-button>
        <el-button @click="dialogFormVisible = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      visible: false,
      form: {
        regTime: '',
        evaluate: ''
      },
      formLabelWidth: '120px'
    }
  },
  methods: {
    errorHandler() {
      return true
    }
  }
}
</script>

<style lang="scss" scoped>
.regularization-container {
  .el-dialog__body {
    padding-bottom: 5px;
  }
  .info {
    display: flex;
    height: 180px;
    padding: 40px 0 20px 60px;

    .title {
      margin-left: 20px;
      padding-top: 12px;
      color: #999999;
      h4 {
        margin: 0;
        color: #606266;
      }
      span {
        color: #606266;
      }
    }
  }
  label {
    font-weight: 400;
  }
  .submitButton {
    text-align: center;
    button {
      margin: 0 20px;
    }
  }
}
</style>
